import React, { Component } from 'react'
import footer from './index.module.css'

export default class Footer extends Component {
  changeAll = (event)=>{
    this.props.changeAllTodo(event.target.checked)
    console.log(event.target.checked);
  }
  delAllTodos = ()=>{
    this.props.delAllTodos()
  }
  render() {
    const { todos } = this.props
    const total = todos.length
    const accomplish = todos.reduce((pre,current)=> pre+(current.isTrue?1:0),0)//最后一个零为初始值
    console.log(accomplish,223);
    return (
      <div className={footer.index}>
          <input type="checkbox" checked={accomplish===total&&total!==0?true:false} onChange={this.changeAll}/>
          已完成{accomplish}/全部{total}
          <button onClick={this.delAllTodos}>删除选中动作</button>
      </div>
    )
  }
}
